<div id="main">
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h4 class="modal-title" id="ntModalLabel">{:strtoupper(lang('add/change_carrier'))}</h4>
</div>
<div class="modal-body">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info">
                <button type="button" class="close">×</button>
                <p></p>
            </div>
        </div>
    </div>
    <div class="row clearfix">
        <div class="col-md-12 column">
            <ul class="nav nav-tabs">
                <li :class="{'active':index==0}" v-for="(langitem,index) in langs" >
                    <a :href="'#'+langitem.code" data-toggle="tab" @click="changelang(langitem.code)">{{langitem.name}}</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="tab-content">
        <div role="tabpanel" :class="{'tab-pane':true, 'active':index==0}" :id="langitem.code" v-for="(langitem,index) in langs">
            <table class="table table-hover ntTable" style="margin-bottom: 0;" v-if="isedit=='carrieredit'">
                <tbody>
                <tr>
                    <td>{:strtoupper(lang('name'))}<span class="required"></span></td>
                    <td>
                        <input type="text" v-model="data['lang_'+langitem.code]" class="form-control">
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="row clearfix">
            <div class="col-md-12">
                <table class="table table-hover ntTable">
                    <tbody>
                    {if ($str eq 'carrieradd')}
                    <tr>
                        <td>{:strtoupper(lang('name'))}<span class="required"></span></td>
                        <td><input type="text" class="form-control" v-model="data.carriername"></td>
                    </tr>
                    {/if}
                    <tr>
                        <td>{:strtoupper(lang('code'))}<span class="required"></span></td>
                        <td><input type="text" class="form-control" v-model="data.code" value=""></td>
                    </tr>
                    <input type="hidden" id="act" name="act" value="{$str}">
                    <input type="hidden" name="id" id="id" value="{$id|default=''}">
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span>{:strtoupper(lang('cancel'))}</button>
    <button type="button" :disabled="isdisadble" @click="subfun" class="btn btn-primary" style="padding-left:24px;padding-right:24px"><span class="glyphicon glyphicon-floppy-disk"></span>{:strtoupper(lang('save'))}</button>
</div>
</div>
<script>
    new Vue({
        el: '#main',
        data: () => ({
            isedit:$('#act').val(),
            langs:[],
            lang: 'zh',//语言
            isdisadble: false,
            data: {
                carriername: '',
                code:'',
            }
        }),
        methods: {
            //保存数据
            subfun(){
                this.isdisadble=true;
                //提交的内容
                if ($('#act').val() == 'carrieredit') {
                    var data = {
                        act: $('#act').val(),
                        code: this.data.code,
                        id: $('#id').val(),
                    }
                    this.langs.forEach(element=>{
                        data['lang_'+element.code]=this.data['lang_'+element.code]
                    })
                } else {
                    var data = {
                        act: $('#act').val(),
                        carriername: this.data.carriername,
                        code: this.data.code,
                    }
                }
                $.ajax({
                    url: '/admin/logistics/' + $('#act').val(),
                    data,
                    type: 'post',
                    success: (data) => {
                        data = JSON.parse(data)
                        if (data.status != 1) {
                            change_mes_type('.modal-body .alert',data.status)
                            $('.modal-body .alert').show()
                            $('.modal-body .alert p').html('*' + data.msg + '<br>')
                        } else {
                            change_mes_type('#headeralert',data.status)
                            $('#headeralert').show()
                            $('#headeralert p').html('*' + data.msg + '<br>')
                            $('#carrier_editModal').modal('toggle')
                        }
                        this.isdisadble=false;
                    }
                })

            },
            //获取编辑的数据
            getalldata(){
                if($('#id').val()){
                    $.ajax({
                        url: '/admin/logistics/' + $('#act').val(),
                        data: {
                            getcarrier: '',
                            id: $('#id').val()
                        },
                        type: 'post',
                        dataType: 'json',
                        success: (data) => {
                            if (data.info) {
                                //编辑的状态
                                this.langs.forEach(element => {
                                    this.data['lang_'+element.code]= data.info['lang_'+element.code];
                                });
                                this.data.code = data.info.code;
                            }
                        }
                    })
                }

            },
            //改变语言
            changelang(lang){
                this.lang = lang;
            }
        },
        created() {
            $.ajax({
                url:'/admin/api/getLangType',
                type:'post',
                success:data=>{
                    lansdata=JSON.parse(data);
                    this.langs = lansdata
                    this.lang=lansdata[0].code;
                    this.langs.forEach(element=>{
                        this.data['lang_'+element.code]=''
                    })
                }
            })
            this.getalldata()
        }
    })
</script>